<template>
  <div class="container">
    <div style="display:flex;justify-content:flex-start;align-items:center;">
      <span>这里用来随机一条语句</span>
      <el-select v-model="selectVal" placeholder="请选择语录种类" style="margin-left:20px;">
        <el-option
          v-for="item in selectList"
          :key="item.value"
          :label="item.label"
          :value="item.value">
        </el-option>
      </el-select>
      <el-button type="primary" style="margin-left:20px;" @click="action">随机</el-button>
    </div>
    <div style="margin-top:20px" v-html="content"></div>
    <div style="margin-top:20px" v-if="from != ''" v-html="from"></div>
  </div>
</template>

<script>
import { quotations,saoHua,mingYan } from '@/common/common'

export default {
  data() {
    return {
      selectList:[
        {label:"骚话",value:568},
        {label:"古诗文名言",value:569},
        {label:"土味情话",value:1001},
        {label:"精神语录",value:1002},
        {label:"网易云热评",value:1003},
        {label:"成人笑话",value:1004},
        {label:"奇葩对话",value:1005},
        {label:"舔狗日记",value:1006},
        {label:"毒鸡汤",value:1007},
        {label:"朋友圈文案",value:1008},
        {label:"骂人宝典",value:1009},
        {label:"动画",value:2001},
        {label:"漫画",value:2002},
        {label:"游戏",value:2003},
        {label:"文学",value:2004},
        {label:"原创",value:2005},
        {label:"来自网络",value:2006},
        {label:"其他",value:2007},
        {label:"影视",value:2008},
        {label:"诗词",value:2009},
        {label:"网易云",value:2010},
        {label:"哲学",value:2011},
        {label:"抖机灵",value:2012}
      ],
      selectVal:"",
      content:'',
      from:""
    }
  },
  methods:{
    action(){
      if(this.selectVal == ''){
        this.$message.error("请先选择语录种类");
        return;
      }
      this.from = '';
      if(this.selectVal == 568){
        let params = {};
        saoHua(params).then(res=>{
          if(res.status == 200){
            let content = res.data.body;
            this.content = content
          }
        })
      }else if(this.selectVal == 569){
        let params = {};
        mingYan(params).then(res=>{
          if(res.status == 200){
            let content = JSON.parse(res.data.body);
            this.content = content.result.name;
            this.from = '出自：' + content.result.from;
          }
        })
      }else {
        let params = {
          c:Number(this.selectVal)
        };
        quotations(params).then((res) => {
          if(res.status == 200){
            let content = res.data.body;
            this.content = content;
          }
        })
        .catch((err) => {
          console.log(err);
        })
      }
    }
  }
}
</script>

<style>
.container {
  width: 100%;
  padding: 1%;
  margin: 0 auto;
}
</style>
